<template>
    <div>
        <div class="history">
            <div class="title">
                <h3>历史记录</h3>
                <van-icon name="delete-o" @click="del()" />
            </div>
            <div class="tag">
                <span v-for="(v,k) in historyKeywordList" :key="k" @click="searchcom(v)">{{v}}</span>
            </div>
        </div>
        <div class="hot">
            <div class="title">
                <h3>热门搜索</h3>
            </div>
            <div class="tag">
                <span v-for="(v,k) in hotKeywordList" :key="k" @click="searchcom(v.keyword)" >{{v.keyword}}</span>
            </div>
        </div>
    </div>
</template>

<script>
import {delHistory,goods_list} from "@/request/home.js"
export default {
    name: 'Wjm0714HistoryList',

    data() {
        return {
            
        };
    },
   

    mounted() {
        
    },

    methods: {
        // 删除历史记录
        del(){
            console.log(123);
            delHistory()
            .then(res=>{
                console.log(res);
                location.reload();
            })
            .catch(err=>{
                console.log(err);
            })
        },
        // 历史热门
        searchcom(v){
            console.log(v);
            this.$store.commit('Sshow',3);
            // goods_list(v).then(res=>{
                // console.log(res.data.data.data);
                this.$emit('his_hot',v);
            // })
            // .catch(err=>{
                // console.log(err);
            // })
        }
    },
    props:['historyKeywordList','hotKeywordList']
};
</script>

<style lang="less" >
    // 历史记录
    .history,.hot{
        width: 100%;
        // height: 1rem;
        background-color: #fff;
        font-family: 黑体;
        margin-bottom: .2rem;
        .title{
            margin: 0 .1rem;
            display: flex;
            flex-wrap: nowrap;
            justify-content: space-between;
            line-height: .30rem;
            align-items: center;
            h3{
                font-size: .18rem;
            }
        }
        .tag{
            font-size: .12rem;
            color: #969799;
            padding: 0 .1rem;
            margin-top: .1rem;
            span{
                display: inline-block;
                padding: .02rem;
                border: 1px solid #969799;
                margin-right: .1rem;
                margin-bottom: .1rem;
            }
        }
    }
</style>